<template>
  <div class="scanCode pgSy">
    <div class="main-box" >
      <div class="scan">
        <div class="imgs">
          <img src="../../../imgs/sc-bg.png" alt="">
        </div>
        <div class="text-box">
          <p class="text" >已经成功下单，请选择操作...</p>
          <p class="text-sup">您也可以”长按上方二维码关注官方公众号 ”方便日后洗衣，或者浏览当前订单进度</p>
        </div>
        <div class="btn-box">
          <router-link to="/device" class="">查看订单</router-link>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import * as api from 'api';
  export default {
    data () {
      return {
      }
    }
  }
</script>
<style lang="scss">
  @import '../../../styles/common/common';
  .pgSy {
    @include bis('../../../imgs/pg-sy.jpg');
  }
  .scanCode {
    @include wh(100%, 100%);
    .main-box {
      @include wh(100%, auto);
      text-align: center;
      padding:  px2rem(260) px2rem(70) 0;
      .scan {
        @include wh(100%, 100%);
        background: #fff;
        @include borderRadius(5px);
        .imgs {
          padding: px2rem(100) px2rem(110) px2rem(20);
          img {
            width: 100%;
          }
        }
        .text-box {
          padding:0 px2rem(90);
          font-size: px2rem(32);
          .text {
            color: #4c4c4c;
          }
          .text-sup {
            padding-top: px2rem(10);
            color: #4c4c4c;
            opacity: 0.7;
            font-size: px2rem(26);
          }
        }
        .btn-box {
          padding: px2rem(40) px2rem(115) px2rem(100);
          a {
            display: block;
            background: #2f9afb;
            @include  wh(100%, px2rem(84));
            @include borderRadius(30px);
            line-height: px2rem(80);
            color: #f5fdff;
            font-size: px2rem(32);
          }
        }
      }
    }
  }
</style>
